// 封装路由模块
// 1. 装包 yarn add vue-router@3.5.3
// 2. 引入到 main.js  VueRouter 是一个构造函数
import VueRouter from 'vue-router'
import Vue from 'vue'

// 引入组件对象
import Find from '../views/Find.vue'
import My from '../views/My.vue'
import Part from '../views/Part.vue'
import NotFound from '../views/NotFound.vue'
// 3. 安装 VueRouter 插件, Vue.use()
// 自动注册 router-view  router-link组件
Vue.use(VueRouter)

// 4. 创建路由对象
// 核心步骤1: 配置路由规则
const routes = [
  // 一个对象表示一条路由规则, 路由就是路径和组件的映射关系
  // {
  //    路径
  //   path: '',
  //    组件
  //   component: 组件对象
  // }
  
  // 重定向默认页面 
  {
    path:'/',
    redirect:'/find'
  },
  {
    // 路径
    path: '/find',
    // 组件
    component: Find
  },
  {
    // 路径
    path: '/my/:id',
    // 组件
    component: My
  },
  {
    // 路径
    path: '/part',
    // 组件
    component: Part
  },
  {
    // 通配符* 表示匹配任意路径
    path:'*',
    component:NotFound
  }
]
const router = new VueRouter({
  // 可以配置路由信息
  routes
})

// 默认导出 router 对象
export default router